<template>
	<view class="content">
		<div style="width: 100%;height: 30px;"></div>
		<span class="password-tip" style="	margin-left: 5%;"><i class="ali-icon password-tip">&#xe710;</i><span style="margin-left: 5px;">密码为6位数字</span></span>
		<!-- 	<org-input-text v-if="displayOldPassword" left-text="" placeholder="请输入原密码" :is-password="true" type="number" class="old-passowrd"
		 maxLength="6" :check-info="checkInfo" @input="oldPassword=$event">
		
			<view slot="left" style="padding: 20rpx 10rpx 0rpx 20rpx;">
				<i class="ali-icon icon-color">&#xe60e;</i>
			</view>
		</org-input-text> -->

		<orgInputText left-text="" placeholder="请输入新密码" :is-password="true" class="old-passowrd" type="number" maxLength="6"
		 :check-info="checkInfo" @input="newPassword=$event">
			<!-- 使用插槽，自定义左侧文本 -->
			<view slot="left" style="padding: 20rpx 10rpx 0rpx 20rpx;">
				<i class="ali-icon icon-color">&#xe60a;</i>
			</view>
		</orgInputText>

		<orgInputText left-text="" placeholder="请再次输入新密码" :is-password="true" class="old-passowrd" type="number" maxLength="6"
		 :check-info="checkInfo" @input="repeatPassword=$event">
			<!-- 使用插槽，自定义左侧文本 -->
			<view slot="left" style="padding: 20rpx 10rpx 0rpx 20rpx;">
				<i class="ali-icon icon-color">&#xe60a;</i>
			</view>
		</orgInputText>

		<orgInputText v-if="phoneLable==null" left-text="" placeholder="手机号" :is-password="false" class="old-passowrd" type="number"
		 maxLength="11" :check-info="checkInfo" @input="phone=$event">
			<!-- 使用插槽，自定义左侧文本 -->
			<view slot="left" style="padding: 20rpx 10rpx 0rpx 20rpx;">
				<i class="ali-icon icon-color">&#xe60a;</i>
			</view>
		</orgInputText>
		<div class="old-passowrd" v-if="phoneLable!=null">您已经绑定了手机号{{phoneLable}}</div>
		<div style="display: flex;">
			<orgInputText style="width: 45%;margin: 0px auto;" left-text="" placeholder="验证码" :is-password="false" type="number"
			 maxLength="6" :check-info="checkInfo" @input="code=$event">
				<!-- 使用插槽，自定义左侧文本 -->
				<view slot="left" style="padding: 20rpx 10rpx 0rpx 20rpx;">
					<i class="ali-icon icon-color">&#xe60a;</i>
				</view>
			</orgInputText>
			<button type="primary" style=" width: 35%;height: 46px;margin-top: 3px;" @click="sendMsg" :disabled="sendBtnLoading"
			 :loading="sendBtnLoading">{{messageBtn}}</button>
		</div>


		<button type="primary" style="margin: 10px auto; width: 90%;margin-left:auto;" @click="ok" :loading="loadding">确定</button>
	</view>
</template>

<script>
	import {
		decryptDes
	} from '@/utils/utils';

	export default {

		data() {
			return {
				getCardIfSetPasswordUlr: "card/getCardIfSetPassword",
				updatePasswordUrl: "card/updatePassword",
				settingPasswordUrl: "card/settingPassword/recheck",
				getCardIfPhone: "card/getCardIfPhone",
				getPagekey: '/pageKey/get.dnl',
				msgPageKey: '/msg/pageKey.dnl',
				sendMsgUrl: '/msg/send/identifyCode',
				checkInfo: {
					msg: "请输入正确的6位数字密码",
					reg: /^\d{6}$/,
					required: true
				},
				oldPassword: '',
				newPassword: "",
				repeatPassword: "",
				phone: null,
				displayOldPassword: false,
				cardId: '',
				loadding: false,
				pagekey: "",
				redir: "",
				messageBtn: '发送短信',
				sendBtnLoading: false,
				messageKey: '',
				uid: '',
				phoneLable: null,
				code: ''
			}
		},
		async onLoad(option) {
			if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
		　　		WeixinJSBridge.invoke('setFontSizeCallback', {
			　　		'fontSize': 0
			　　});
			　　// 重写设置网页字体大小的事件
			　　WeixinJSBridge.on('menu:setfont', function () {
			　　　　WeixinJSBridge.invoke('setFontSizeCallback', {
			　　　　　　'fontSize': 0
			　　　　});
			　　});
			　
			};
			let cardId = option.cardId
			this.cardId = cardId
			//获取卡是否设置密码
			let ifsetPassword = await this.$req.userData(this.getCardIfSetPasswordUlr, {
				id: cardId
			})
			this.displayOldPassword = ifsetPassword.data
			uni.showLoading({
				title: '加载中',
				mask: true
			});
			let pk = await this.$req.sendCheck(this.getPagekey)
			let key = decryptDes(pk.data, 'shendawl', ['s', 'h', 'e', 'n', 'd', 'a', 'w', 'l'])
			this.pagekey = key
			if (option._redir != undefined) {
				this.redir = decodeURIComponent(atob(option._redir))
			}
			 this.$req.userData(this.getCardIfPhone, {
				id: cardId
			}).then(phoneBack=>{
				let ifTiePhone = phoneBack.data.value
				if (ifTiePhone != null && ifTiePhone != '') {
					this.phoneLable = ifTiePhone.substring(0, 3) + "****" + ifTiePhone.substring(ifTiePhone.length - 3, ifTiePhone.length)
					this.phone = ifTiePhone
				}
			})

			//this.phone = ifTiePhone
			uni.hideLoading()

		},
		methods: {
			async ok() {
				let reg = new RegExp(this.checkInfo.reg)
				if (!reg.test(this.newPassword) || !reg.test(this.repeatPassword)) {
					this.msg = this.checkInfo.msg;
					this.isTrue = false;
					uni.showToast({
						icon: "none",
						title: this.checkInfo.msg
					});
					return;

				}
				if (this.newPassword != this.repeatPassword) {
					uni.showToast({
						icon: "none",
						title: "两次密码输入不一致！",
						duration: 3000
					});
					return
				}
				if (this.code == '') {
					uni.showToast({
						icon: "none",
						title: "请输入验证码！",
						duration: 3000
					});
					return
				}
				let req = ""
				// 展示就是更新密码 
				this.loadding = true;
				let obj = {}
				if (this.displayOldPassword) {
					try {
						obj = await this.$req.userData(this.updatePasswordUrl, {
							id: this.cardId,
							cardPassword: this.oldPassword,
							newCardPassword: this.newPassword,
							uid: this.uid,
							phone: this.phone,
							code: this.code
						})
					} catch (e) {
						console.log(e)
					}
					this.loadding = false
				} // 不展示就是设置密码
				else {
					try {
						obj = await this.$req.userData(this.settingPasswordUrl, {
							id: this.cardId,
							cardPassword: this.newPassword,
							pagekey: this.pagekey,
							uid: this.uid,
							phone: this.phone,
							code: this.code
						})
					} catch (e) {
						console.log(e)
					}
					this.loadding = false
				}

				if (obj.code==10000) {
					uni.showToast({
						icon: "none",
						title: "操作成功！正在返回上一页",
						duration: 3000
					});
					if (this.redir != undefined&&this.redir !='') {
						setTimeout(() => {
							uni.navigateTo({
								url: "/" + this.redir
							})
						}, 2000)
					} else {
						setTimeout(() => {
							uni.switchTab({
								url: '/pages/tabbar/cardList/cardList'
							})
						}, 2000)
					}

				} else {
					this.loadding = false
				}
			},
			async sendMsg() {
				if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.phone))) {
					this.$message("您输入的手机号有误！")
					return
				}
				//获取加密串
				let pk = await this.$req.sendCheck(this.msgPageKey, {
					messageFlag: 'XIAOXIANG'
				})
				let messageKey = decryptDes(pk.data, 'shendawl', ['s', 'h', 'e', 'n', 'd', 'a', 'w', 'l'])
				let count = 60
				this.sendBtnLoading = true
				let timeout = setInterval(v => {
					this.messageBtn = `重试(${count})`
					count--;
					if (count == 0) {
						this.sendBtnLoading = false
						this.messageBtn = "发送短信"
						window.clearInterval(timeout)
					}
				}, 1000)
				let backmsg = await this.$req.sendCheck(this.sendMsgUrl, {
					uid: messageKey,
					phone: this.phone,
					messageFlag: 'XIAOXIANG',
					remark:"修改密码"
				})
				this.uid = backmsg.data
			},
		},
	}
</script>

<style lang="scss">
	.icon-color {
		color: $theme-color
	}

	.old-passowrd {
		width: 90%;
		margin: 30px auto;
	}

	.password-tip {
		font-size: small;
		color: $theme-color;
	}
</style>
